#page-3 {
	background: url("../images/bg-4.png") no-repeat center; color: rgb(255, 255, 255);
}
#page-3 .timeline {
	background: url("../images/p3-timeline-line.png") no-repeat center 50px; text-align: center; margin-top: 140px; position: relative;
}
#page-3 .timeline li {
	background: url("../images/p3-timeline-point.png") no-repeat center 43px; margin: 0px -30px; transition:color 0.3s linear; width: 140px; color: rgb(68, 68, 68); vertical-align: top; display: inline-block; cursor: pointer; -moz-transition: color .3s linear; -webkit-transition: color .3s linear; -o-transition: color .3s linear;
}
#page-3 .timeline li:hover {
	color: rgb(187, 187, 187);
}
#page-3 .timeline li.current {
	color: rgb(255, 255, 255);
}
#page-3 .timeline li .time {
	height: 20px;
}
#page-3 .timeline li .circle {
	background: url("../images/p3-timeline-point-active.png") no-repeat center; margin: 14px auto; transition:0.3s linear; width: 33px; height: 33px; display: block; opacity: 0; -moz-transition: all .3s linear; -webkit-transition: all .3s linear; -o-transition: all .3s linear;
}
#page-3 .timeline li .version {
	height: 40px;
}
#page-3 .timeline li .time {
	transition:opacity 0.2s linear; opacity: 0; -moz-transition: opacity .2s linear; -webkit-transition: opacity .2s linear; -o-transition: opacity .2s linear;
}
#page-3 .timeline li .description {
	transition:opacity 0.2s linear; opacity: 0; -moz-transition: opacity .2s linear; -webkit-transition: opacity .2s linear; -o-transition: opacity .2s linear;
}
#page-3 .timeline li.current .time {
	opacity: 1;
}
#page-3 .timeline li.current .description {
	opacity: 1;
}
#page-3 .timeline li.current .circle {
	animation:circleZoom 0.3s linear forwards; opacity: 1; background-size: 100% 100%; -webkit-animation: circleZoom .3s linear forwards; -moz-animation: circleZoom .3s linear forwards; -o-animation: circleZoom .3s linear forwards;
}
#page-3 .timeline .dot {
	background: rgb(255, 255, 255); border-radius: 2px; animation:kirakira 0.8s linear infinite alternate; left: 0px; top: 49px; width: 4px; height: 4px; font-size: 0px; position: absolute; -webkit-animation: kirakira .8s linear infinite alternate; -moz-animation: kirakira .8s linear infinite alternate; -o-animation: kirakira .8s linear infinite alternate;
}
#page-3 .introduction {
	margin: 90px 0px 0px; padding: 20px 40px; border-radius: 10px; border: 1px solid rgb(49, 49, 49); transition:0.5s linear; border-image: none; color: rgb(153, 153, 153); line-height: 1.8; font-size: 14px; -moz-transition: all .5s linear; -webkit-transition: all .5s linear; -o-transition: all .5s linear;
}
#page-3 .introduction:hover {
	border-color: rgb(136, 136, 136); color: rgb(238, 238, 238);
}
